*{margin:0;padding:0;box-sizing:border-box}:root{--yellow: #FFE500;--pink: #FF6B6B;--black: #000000;--white: #FFFFFF;--gray: #F5F5F5;--dark-gray: #333333;--border-thick: 5px solid var(--black);--border-medium: 3px solid var(--black);--border-thin: 2px solid var(--black);--shadow-brutal: 8px 8px 0 var(--black);--shadow-small: 4px 4px 0 var(--black);--shadow-large: 12px 12px 0 var(--black);--font-base: -apple-system, BlinkMacSystemFont, "Segoe UI", "Arial Black", sans-serif;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.25rem;--font-size-xl: 1.5rem;--font-size-2xl: 2rem;--font-size-3xl: 3rem;--font-size-4xl: 4rem;--bg-primary: #FFFFFF;--bg-secondary: #F5F5F5;--text-primary: #000000;--text-secondary: #333333;--border-color: #000000}body.dark-mode{--bg-primary: #1a1a1a;--bg-secondary: #2a2a2a;--text-primary: #FFFFFF;--text-secondary: #cccccc;--border-color: #FFFFFF;--border-thick: 5px solid var(--border-color);--border-medium: 3px solid var(--border-color);--border-thin: 2px solid var(--border-color);--shadow-brutal: 8px 8px 0 rgba(255, 255, 255, .3);--shadow-small: 4px 4px 0 rgba(255, 255, 255, .3);--shadow-large: 12px 12px 0 rgba(255, 255, 255, .3);--dot-color: rgba(255, 255, 255, .15)}body.dark-mode .dot-pattern{background-image:radial-gradient(circle,rgba(255,255,255,.2) 1.5px,transparent 1.5px)}body{font-family:var(--font-base);background:var(--bg-primary);color:var(--text-primary);line-height:1.4;overflow-x:hidden;font-weight:700;transition:background-color .3s ease,color .3s ease}.dot-pattern{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-2;background-image:radial-gradient(circle,var(--black) 1.5px,transparent 1.5px);background-size:24px 24px;opacity:.15;pointer-events:none}.floating-shapes{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;pointer-events:none;overflow:hidden}.shape{position:absolute;animation:float-around 20s infinite ease-in-out}.shape-circle{font-size:80px;line-height:1;top:10%;right:10%;animation-delay:0s}.shape-square{font-size:60px;line-height:1;bottom:20%;left:5%;animation-delay:5s}.shape-triangle{width:0;height:0;border-left:40px solid transparent;border-right:40px solid transparent;border-bottom:70px solid var(--yellow);top:50%;right:5%;animation-delay:10s;filter:drop-shadow(var(--border-medium))}@keyframes float-around{0%,to{transform:translate(0) rotate(0)}25%{transform:translate(30px,-50px) rotate(90deg)}50%{transform:translate(-20px,-30px) rotate(180deg)}75%{transform:translate(40px,20px) rotate(270deg)}}.header{background:var(--yellow);border-bottom:var(--border-thick);padding:1rem 0;position:sticky;top:0;z-index:100}.header-container{max-width:1400px;margin:0 auto;padding:0 2rem;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}.header-left{display:flex;align-items:center;gap:1rem}.logo{font-size:3rem;line-height:1;transform:rotate(-5deg)}.header-text{display:flex;flex-direction:column}.header-title{font-size:var(--font-size-2xl);font-weight:900;letter-spacing:-1px;text-transform:uppercase;line-height:1}.header-subtitle{font-size:var(--font-size-sm);font-weight:700;text-transform:uppercase;letter-spacing:1px}.header-controls{display:flex;align-items:center;gap:1rem}.theme-toggle{background:var(--white);border:var(--border-medium);padding:.75rem;cursor:pointer;box-shadow:var(--shadow-small);display:flex;align-items:center;justify-content:center;font-size:1.5rem;transition:all .2s;position:relative;width:50px;height:50px}.theme-toggle:hover{transform:translateY(-2px);box-shadow:6px 6px 0 var(--border-color)}.theme-toggle:active{transform:translateY(0);box-shadow:var(--shadow-small)}.theme-icon{position:absolute;transition:opacity .3s ease,transform .3s ease}.theme-icon-light{opacity:1;transform:rotate(0)}.theme-icon-dark,body.dark-mode .theme-icon-light{opacity:0;transform:rotate(180deg)}body.dark-mode .theme-icon-dark{opacity:1;transform:rotate(0)}body.dark-mode .theme-toggle{background:var(--bg-secondary)}.language-selector{display:flex;align-items:center;gap:.75rem;background:var(--white);border:var(--border-medium);padding:.75rem 1rem;box-shadow:var(--shadow-small)}.lang-label{font-size:var(--font-size-sm);font-weight:900;text-transform:uppercase;letter-spacing:1px}.lang-select{font-family:var(--font-base);font-size:var(--font-size-base);font-weight:700;background:var(--white);border:var(--border-thin);padding:.5rem 2rem .5rem .75rem;cursor:pointer;text-transform:uppercase;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M0 0 L6 8 L12 0 Z' fill='%23000'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .5rem center}.lang-select:focus{outline:3px solid var(--pink);outline-offset:2px}.main-container{max-width:1400px;margin:0 auto;padding:3rem 2rem}.hero{text-align:center;margin-bottom:4rem}.hero-title{display:flex;flex-direction:column;align-items:center;gap:.5rem}.hero-line-1{font-size:clamp(2.5rem,10vw,5rem);font-weight:900;text-transform:uppercase;letter-spacing:-2px;background:var(--white);border:var(--border-thick);padding:.5rem 2rem;box-shadow:var(--shadow-brutal)}.hero-line-2{font-size:clamp(2rem,8vw,4rem);font-weight:900;text-transform:uppercase;letter-spacing:-2px;background:var(--yellow);border:var(--border-thick);padding:.5rem 2rem;box-shadow:var(--shadow-brutal)}.stats-section{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;margin-bottom:4rem}.stat-box{border:var(--border-thick);padding:2rem;text-align:center;box-shadow:var(--shadow-brutal);transform:rotate(-1deg);transition:transform .2s}.stat-box:hover{transform:rotate(0) scale(1.05)}.stat-yellow{background:var(--yellow)}.stat-pink{background:var(--pink);color:var(--white)}.stat-black{background:var(--black);color:var(--white)}.stat-icon{font-size:3rem;margin-bottom:.5rem}.stat-value{font-size:var(--font-size-3xl);font-weight:900;line-height:1}.stat-label{font-size:var(--font-size-sm);text-transform:uppercase;letter-spacing:1px;margin-top:.5rem}.section-box,.output-box,.history-box{background:var(--bg-primary);border:var(--border-thick);padding:2rem;margin-bottom:3rem;box-shadow:var(--shadow-large);transition:background-color .3s ease}.section-title{font-size:var(--font-size-xl);font-weight:900;text-transform:uppercase;letter-spacing:-1px;margin-bottom:1.5rem;display:flex;align-items:center;gap:.5rem}.title-icon{font-size:1.5em}.mode-selector{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;margin-bottom:2rem}.mode-btn{background:var(--bg-secondary);border:var(--border-medium);padding:1rem;font-family:var(--font-base);font-size:var(--font-size-base);font-weight:900;text-transform:uppercase;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;box-shadow:var(--shadow-small);transition:all .2s;color:var(--text-primary)}.mode-btn:hover{background:var(--yellow);color:var(--black);transform:translateY(-2px)}.mode-btn.active{background:var(--text-primary);color:var(--bg-primary);transform:scale(1.05)}.mode-btn span:first-child{font-size:1.5em}.creativity-control{background:var(--bg-secondary);border:var(--border-medium);padding:1.5rem;margin-bottom:2rem;transition:background-color .3s ease}.creativity-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;font-size:var(--font-size-base);font-weight:900;text-transform:uppercase}.creativity-value{background:var(--yellow);padding:.25rem .75rem;border:var(--border-thin)}.creativity-slider{width:100%;height:12px;background:var(--bg-primary);border:var(--border-thin);outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.creativity-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:30px;height:30px;background:var(--pink);border:var(--border-medium);cursor:pointer}.creativity-slider::-moz-range-thumb{width:30px;height:30px;background:var(--pink);border:var(--border-medium);cursor:pointer}.creativity-labels{display:flex;justify-content:space-between;margin-top:.5rem;font-size:var(--font-size-xs);font-weight:700;text-transform:uppercase}.text-input-wrapper{position:relative;margin-bottom:2rem}.text-input{width:100%;min-height:180px;font-family:var(--font-base);font-size:var(--font-size-lg);font-weight:600;background:var(--bg-primary);color:var(--text-primary);border:var(--border-thick);padding:1.5rem;resize:vertical;box-shadow:var(--shadow-small);transition:background-color .3s ease,color .3s ease}.text-input:focus{outline:4px solid var(--pink);outline-offset:4px}.char-counter{position:absolute;bottom:1rem;right:1rem;background:var(--yellow);border:var(--border-thin);padding:.25rem .75rem;font-size:var(--font-size-sm);font-weight:900}.convert-btn{width:100%;background:var(--pink);border:var(--border-thick);padding:1.5rem 2rem;font-family:var(--font-base);font-size:var(--font-size-xl);font-weight:900;text-transform:uppercase;letter-spacing:-1px;cursor:pointer;box-shadow:var(--shadow-brutal);display:flex;align-items:center;justify-content:center;gap:.75rem;transition:transform .1s;color:var(--white)}.convert-btn:hover:not(:disabled){transform:translate(-4px,-4px);box-shadow:12px 12px 0 var(--black)}.convert-btn:active:not(:disabled){transform:translate(0);box-shadow:4px 4px 0 var(--black)}.convert-btn:disabled{opacity:.6;cursor:not-allowed}.btn-icon{font-size:1.5em}.examples-section{margin-bottom:3rem}.examples-title{font-size:var(--font-size-2xl);font-weight:900;text-transform:uppercase;letter-spacing:-1px;margin-bottom:.5rem}.examples-subtitle{font-size:var(--font-size-base);font-weight:700;margin-bottom:1.5rem;text-transform:uppercase}.examples-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}.example-card{background:var(--yellow);border:var(--border-medium);padding:1.5rem;cursor:pointer;box-shadow:var(--shadow-small);transition:all .2s;position:relative;overflow:hidden}.example-card:hover{background:var(--pink);color:var(--white);transform:translate(-4px,-4px);box-shadow:8px 8px 0 var(--black)}.example-text{font-size:var(--font-size-lg);font-weight:700;margin-bottom:.75rem}.example-badge{display:inline-block;background:var(--black);color:var(--white);border:var(--border-thin);padding:.25rem .75rem;font-size:var(--font-size-xs);font-weight:900;text-transform:uppercase;letter-spacing:1px}.example-card:hover .example-badge{background:var(--white);color:var(--black)}.output-box{background:var(--gray)}.output-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;margin-bottom:1.5rem}.copy-btn{background:var(--yellow);border:var(--border-medium);padding:.75rem 1.5rem;font-family:var(--font-base);font-size:var(--font-size-sm);font-weight:900;text-transform:uppercase;cursor:pointer;display:flex;align-items:center;gap:.5rem;box-shadow:var(--shadow-small);transition:all .2s}.copy-btn:hover{background:var(--pink);color:var(--white);transform:translateY(-2px)}.output-display{background:var(--bg-primary);border:var(--border-thick);padding:3rem;min-height:200px;display:flex;align-items:center;justify-content:center;font-size:4rem;text-align:center;line-height:1.5;flex-wrap:wrap;gap:.5rem;box-shadow:var(--shadow-small);transition:background-color .3s ease}.output-placeholder{font-size:var(--font-size-lg);font-weight:700;color:var(--text-secondary);opacity:.5}#alertContainer{margin-bottom:1rem}.alert{padding:1rem 1.5rem;border:var(--border-medium);font-size:var(--font-size-base);font-weight:700;text-transform:uppercase;margin-bottom:1rem;display:flex;align-items:center;gap:.75rem;animation:slide-in .3s ease-out}@keyframes slide-in{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}.alert-success{background:var(--yellow);color:var(--black)}.alert-error{background:var(--pink);color:var(--white)}.history-list{display:flex;flex-direction:column;gap:1rem;max-height:500px;overflow-y:auto}.history-list::-webkit-scrollbar{width:12px}.history-list::-webkit-scrollbar-track{background:var(--gray);border:var(--border-thin)}.history-list::-webkit-scrollbar-thumb{background:var(--black);border:var(--border-thin)}.history-empty{text-align:center;padding:3rem 2rem;font-size:var(--font-size-lg);font-weight:700;color:var(--dark-gray);opacity:.6}.history-item{background:var(--bg-secondary);border:var(--border-medium);padding:1rem;display:grid;grid-template-columns:1fr auto;gap:1rem;align-items:center;transition:all .2s}.history-item:hover{background:var(--yellow);color:var(--black);transform:translate(4px)}.history-text{font-size:var(--font-size-base);font-weight:600}.history-meta{font-size:var(--font-size-xs);font-weight:700;color:var(--text-secondary);margin-top:.25rem;text-transform:uppercase}.history-emoji{font-size:2.5rem}.footer{background:var(--black);color:var(--white);border-top:var(--border-thick);padding:2rem;text-align:center;margin-top:4rem}.footer p{font-size:var(--font-size-base);font-weight:700;margin-bottom:1rem}.footer-heart{display:inline-block;animation:heartbeat 1.5s infinite}@keyframes heartbeat{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}.footer-badge{display:inline-block;background:var(--yellow);color:var(--black);border:var(--border-thin);padding:.5rem 1rem;font-size:var(--font-size-xs);font-weight:900;text-transform:uppercase;letter-spacing:2px;transform:rotate(-2deg)}.footer-info{display:flex;flex-direction:column;align-items:center;gap:1rem}.footer-copyright{font-size:var(--font-size-sm);font-weight:700;color:var(--white);opacity:.8;letter-spacing:.5px}@media(max-width:480px){.footer-copyright{font-size:var(--font-size-xs)}}@media(max-width:768px){.header-container{flex-direction:column;text-align:center}.header-left{flex-direction:column}.hero-line-1,.hero-line-2{font-size:clamp(1.5rem,8vw,3rem);padding:.5rem 1rem}.stats-section{grid-template-columns:1fr;gap:1.5rem}.mode-selector{grid-template-columns:1fr}.output-display{font-size:3rem;padding:2rem}.examples-grid{grid-template-columns:1fr}.output-header{flex-direction:column;align-items:flex-start}.main-container{padding:2rem 1rem}.section-box,.output-box,.history-box{padding:1.5rem}}@media(max-width:480px){.header-title{font-size:var(--font-size-xl)}.header-subtitle{font-size:var(--font-size-xs)}.convert-btn{font-size:var(--font-size-lg);padding:1.25rem 1.5rem}.text-input{font-size:var(--font-size-base)}.stat-value{font-size:var(--font-size-2xl)}}